<template>
  <Portlet>
    <el-row>
      <el-col :span="4">
        <Upload-image :formData="{}" :showPictureNum="true" :readonly="true" :value="handleJsonStringArr(fhbOrder.imgAddress)"></Upload-image>
      </el-col>
      <el-col :span="8">
        <div class="marginBottom8">
          <p>
            {{fhbOrder.orderNo}}
          </p>
          <p>
            {{fhbOrder.business}} | {{fhbOrder.service}}
          </p>
          <p>
            商品名称：<Truncate :value="goodsName" :maxLength="20"></Truncate>，共{{goodsNum}}套
          </p>
          <p>
            客户姓名：{{fhbOrderConsigneeInfo.consigneName}} {{fhbOrderConsigneeInfo.consignePhone}}
          </p>
          <p>
            客户地址：{{fhbOrderConsigneeInfo.consigneProvince}} {{fhbOrderConsigneeInfo.consigneCity}} {{fhbOrderConsigneeInfo.consigneDistrict}} {{fhbOrderConsigneeInfo.consigneAddress}}
          </p>
        </div>
      </el-col>
      <el-col :span="6" class="text-center" style="min-height: 180px;">
        <div class="cell-center">
          <div v-if="GET_GLOBAL_CONFIG('fhbwebShowRO')">
            <p>参考报价</p>
            <p v-if="fhbOrder.referenceMinMoney && fhbOrder.referenceMaxMoney">
              ￥: {{fhbOrder.referenceMinMoney | decimalNumFilter}} ~ {{fhbOrder.referenceMaxMoney | decimalNumFilter}}
            </p>
            <p v-else>
              无
            </p>
          </div>
        </div>
      </el-col>
      <el-col :span="6" class="text-center" style="min-height: 180px;">
        <div class="cell-center">
          <slot name="tools"></slot>
        </div>
      </el-col>
    </el-row>
  </Portlet>
</template>

<script>
import {dotData, handleJsonStringArr} from '@/utils'
import {mapGetters} from 'vuex'
export default {
  name: 'offering-header',
  props: {
    orderDetail: {
      type: Object,
      default() {
        return {}
      }
    }
  },
  components: {
  },
  data() {
    return {
      isFhbAdminPath: -1,
      biddingId: '',
      biddingPayId: '',
      cancelId: [],
      showCancelOrder: false
    }
  },
  computed: {
    fhbOrder() {
      return dotData(this.orderDetail, 'fhbOrder') || {}
    },
    fhbOrderGoods() {
      return dotData(this.orderDetail, 'fhbOrderGoods') || []
    },
    fhbOrderConsigneeInfo() {
      return dotData(this.orderDetail, 'fhbOrderConsigneeInfo') || {}
    },
    goodsNum() {
      let tempNum = 0
      for (let v of this.fhbOrderGoods) {
        tempNum += (v.num ? parseInt(v.num) : 0)
      }
      return tempNum
    },
    goodsName() {
      let tempName = ''
      for (let v of this.fhbOrderGoods) {
        tempName += v.bigClass + '/' + v.middleClass + ' '
      }
      return tempName
    },
    ...mapGetters(['GET_GLOBAL_CONFIG'])
  },
  methods: {
    handleJsonStringArr
  }
}
</script>

<style scoped>

</style>
